<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>积分平台</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" type="text/css" href="__INDEX__/mui/css/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="__INDEX__/css/iconfont.css"/>
		<link rel="stylesheet" type="text/css" href="__INDEX__/css/common.css"/>
		<link rel="stylesheet" type="text/css" href="__INDEX__/css/shopping.css"/>
		<script src="__INDEX__/js/lib/font.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
	    <header class="mui-bar mui-bar-nav">
	        <a class="mui-icon mui-icon-left-nav mui-pull-left goindex" style="color: #ffffff"></a>
	        <h1 class="mui-title">公司产品兑换</h1>
	        <a href="{:url('index/productAdd')}" class="mui-pull-right mui-icon">
	        	<img width="18" src="__INDEX__/images/chuangjian.png"/>
	        </a>
	    </header>
	    <div class="mui-content">
	    	<div class="cont-top-shaixuan" id="parent">
	    		<div class="mui-pull-left btn">
	    			<i class="iconfont"></i>
	    			<span><img  src="__INDEX__/images/shaixuan.png"/>筛选</span>
	    		</div>
	    		<div class="mui-pull-right show saixuan">
	    			<p>选择条件</p><img src="__INDEX__/images/xia.png"/>
	    			<ul class="saixuan-mune" id="uls">
		    			<li data-num="1">0分~100分</li>
		    			<li data-num="2">100分~1000分</li>
		    			<li data-num="3">1000分~无限</li>
		    			<li data-num="4">无限制</li>
		    		</ul>
	    		</div>
	    	</div>
	    	<div class="cont-shangping" id="files">
				{foreach $data as $value}
	    		<div class="shangping-item mui-pull-left">
	    			<a href="{:url('index/shoppingInfo')}?id={$value['id']}">
	    				<img src="{:getImg($value['picture'])}"/>
	    			</a>
	    			<h3>{$value['product_name']}</h3>
	    			<div class="jifen"><span>{$value['required_integral']}</span>积分</div>
	    			<p>市场参考价：{$value['market_value']}元</p>
	    		</div>
				{/foreach}
	    	</div>
	    </div>
		<script src="__INDEX__/js/lib/zepto.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/mui/js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/mui/js/mui.view.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/layer_mobile/layer.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/js/common.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/js/lib/fastclick.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/js/shopping.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/js/jquery.3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="__INDEX__/js/maowenke.js" type="text/javascript" charset="utf-8"></script>
	<script>
		$(".goindex").on('tap',function () {
			window.location.href="{:url('index/platform')}";
        });
        $('.saixuan-mune li').unbind().on('tap',function(event){
            var text = $(this).text();
            $('.saixuan').find('p').text(text);
            $('.saixuan-mune li').removeClass('checked');
            $(this).addClass('checked');
            $('.saixuan').removeClass('active');
            $('.saixuan-mune').hide();
            event.stopPropagation();
            var $start = '';
            var $end   = '';
            if(text=='0分~100分'){
                $start = 1;
                $end   = 100;
            }else if(text=='100分~1000分'){
                $start = 100;
                $end   = 1000;
            }else if(text=='1000分~无限'){
                $start = 1000;
                $end   = '';
            }else if(text=='无限制'){
                $start = 1;
                $end   = '';
            }
            $.post("{:url('api/products')}",{start:$start,end:$end},function (data) {
                console.log(data);
				var $str = '';
				$("#files").empty();
				$.each(data,function (i,v) {
					$str +='<div class="shangping-item mui-pull-left">'+
                        '<a href="{:url('index/shoppingInfo')}?id='+v.id+'">'+
                        '<img src="/static/uploads/'+v.picture+'"/>'+
                        '</a>'+
                        '<h3>'+v.product_name+'</h3>'+
                        '<div class="jifen"><span>'+v.required_integral+'</span>积分</div>'+
                        '<p>市场参考价：'+v.market_value+'元</p>'+
                    '</div>';
                })
                $("#files").append($str);
            });
        })
	</script>
	</body>
</html>
